<template>
  <div class="app-container">
    <div class="filter-container">
      <el-form ref="queryForm" :model="formData" :inline="true">
        <el-form-item label="用户ID" prop="userNo"><el-input placeholder="用户ID" v-model="formData.userNo"></el-input></el-form-item>

        <el-form-item label="查询时间" prop="times">
          <el-date-picker v-model="times" @change="changeTime" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery('queryForm')">查询</el-button>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="exportExcel()">导出Excel</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div style="position: relative;">
      <el-tabs v-model="activeName" type="card">
        <el-tab-pane label="发放记录" name="1">
          <!-- 注册实名送币 -->
          <el-table :data="tableData1" style="width: 100%">
            <el-table-column prop="userNo" label="用户ID"></el-table-column>
            <el-table-column prop="currencyName" label="币种"></el-table-column>
            <el-table-column prop="changeNum" label="数量"></el-table-column>
            <el-table-column prop="updateTime" label="发放时间">
              <template v-slot="scope">
                <span>{{ parseTime(scope.row.updateTime) }}</span>
              </template>
            </el-table-column>
          </el-table>

          <pagination v-show="pages1.total > 0" :total="pages1.total" :page.sync="pages1.pageNumber" :limit.sync="pages1.pageSize" @pagination="getList" />
        </el-tab-pane>
      </el-tabs>
      <span style="position: absolute;right:10px;top:10px;">已发放:2820830FEX-假数据</span>
    </div>
  </div>
</template>

<script>
import { findRegisterList } from '@/api/activity/index';
export default {
  name: 'RegDetail',
  data() {
    return {
      times: '',
      formData: {
        userNo: '',
        // createTime: "",
        // endTime: "",
        times: ''
      },
      activeName: '1',
      tableData1: [],
      pages1: {
        pageNumber: 1,
        pageSize: 20,
        total: 0
      }
    };
  },
  mounted() {
    const item = JSON.parse(this.$route.query.item)
    this.formData.userNo = item.id
    this.getList();
  },
  methods: {
    changeTime(val) {
      if (val) {
        let start = val[0],
          end = val[1];
        this.formData.createTime = new Date(start).getTime();
        this.formData.endTime = new Date(end).getTime();
      } else {
        this.formData.createTime = '';
        this.formData.endTime = '';
        delete this.formData.createTime;
        delete this.formData.endTime;
      }
    },
    handleQuery(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.getList();
        } else {
          console.log('error');
          return false;
        }
      });
    },
    getList() {
      const data = {
        ...this.formData,
        ...this.pages1
      };
      findRegisterList(data)
        .then(res => {
          console.log(res);
          let list = res.result || [];
          this['pages' + this.activeName].total = res.totalSize;
          this['tableData' + this.activeName] = list;
          console.log(this['tableData' + this.activeName]);
          console.log(list);
        })
        .catch(err => {});
    },
    exportExcel() {}
  }
};
</script>

<style></style>
